import { mapState, mapGetters } from 'vuex'
import { TimeFormatter } from '@/libs/utils'
import destroyEnvTip from '@/mixin/destroyEnvironmentMixin'
export const sceneCol = {
  mixins: [destroyEnvTip],
  data() {
    let _this = this
    return {
      sceneCol: [
        // {
        //     type: 'selection',
        //     width: 60,
        //     align: 'center'
        // },
        {
          type: 'link',
          title: '名称',
          key: 'name',
          minWidth: 150,
          tooltip: true,
          disabled: () => [17, 18].includes(this.type),
          on: {
            click: (row) => {
              if (this.type !== 17) {
                this.toDetailPageTip(row)
              }
            }
          }
          // click: this.toDetailPageTip
        },
        {
          type: 'link',
          title: this.type === 17 ? '环境工程' : '工程名称',
          key: 'projectName',
          minWidth: 100,
          tooltip: true,
          disabled: () => this.$store.state.common.sysConfig.modeConfig == '1',
          on: {
            click: (row) => {
              if (this.$store.state.common.sysConfig.modeConfig == '2') {
                this.$Message.info('未授权功能，请联系管理员')
              } else if (this.$store.state.common.sysConfig.modeConfig == 'jizhi2024') {
                this.gotoTopo(row)
              }
            }
          }
        },
        {
          title: this.getStitle ? this.getStitle() + '进度' : '演练进度',
          key: 'progress',
          minWidth: 100,
          tooltip: true,
          filter: (progress) => {
            return _this.$options.filters.progressFilter(progress, 'text')
          },
          setColor: (progress) => {
            return _this.$options.filters.progressFilter(progress, 'color')
          }
        },
        {
          title: '部署状态',
          key: 'deployStatus',
          minWidth: 120,
          // filter: (deployStatus, data) => {
          //     return _this.$options.filters.deployStatusFilter(data, 'text')
          // },
          // setColor: (deployStatus, data) => {
          //     return _this.$options.filters.deployStatusFilter(data, 'color')
          // },
          render: (h, params) => {
            let extension = (params.row.extension && JSON.parse(params.row.extension)) || {}
            let endClearConfig = [0, 1].includes(extension.endClearConfig)
              ? extension.endClearConfig
              : this.needTip
              ? 1
              : 0
            return h('div', [
              h(
                'Tooltip',
                {
                  props: {
                    content:
                      params.row.errorMessage === '失败原因请查看部署进度中的详情信息'
                        ? '败原因请进入工程查看部署进度中的详情信息'
                        : params.row.errorMessage,
                    disabled: !params.row.errorMessage,
                    transfer: true
                  },
                  style: {
                    display: 'inline-block',
                    color: _this.$options.filters.deployStatusFilter(params.row, 'color')
                  }
                },
                _this.$options.filters.deployStatusFilter(params.row, 'text')
              ),
              h('WarningTip', {
                props: {
                  content: `您的环境将于${TimeFormatter.time(
                    this.destoryTime(params.row)
                  )}时自动回收，若仍需保留，请在回收前重新开始`
                },
                style: {
                  marginLeft: '4px',
                  display:
                    params.row.endTime &&
                    params.row.deployStatus == 3 &&
                    params.row.progress == 4 &&
                    endClearConfig &&
                    this.type !== 18
                      ? 'inline-block'
                      : 'none'
                }
              })
            ])
          }
        },
        {
          type: 'Tag',
          title: '题目个数',
          key: 'questionTotal',
          show: this.type === 18,
          minWidth: 80,
          fun: (data) => {
            if (data.questionTotal > 0) {
              this.$refs.questionModal.openModal(data.id)
            } else {
              this.$Message.info('暂无题目信息')
            }
          }
        },
        {
          title: '完成个数',
          key: 'finishTotal',
          minWidth: 80,
          show: this.type === 18
        },
        {
          title: '归档状态',
          key: 'filingStatus',
          setColor: (filingStatus) => {
            return filingStatus ? 'var(--status-yes)' : 'var(--status-no)'
          },
          filter: (filingStatus) => {
            return filingStatus ? '已归档' : '未归档'
          },
          show: ![17, 18].includes(this.type),
          minWidth: 100
        },
        // {
        //     type: 'link',
        //     title: '工程名称',
        //     key: 'projectName',
        //     tooltip: true,
        //     fun: this.gotoTopo,
        //     minWidth: 100
        // },
        // {
        //     title: '发布状态',
        //     key: 'tag',
        //     setColor: (tag) => {
        //         return tag ? '#307CED' : 'rgba(255,255,255,0.4000)';
        //     },
        //     filter: (tag) => {
        //         return tag ? '已发布' : '未发布';
        //     },
        //     minWidth: 100
        // },
        // {
        //     // type: 'Tag',
        //     title: '发布',
        //     key: 'selfType',
        //     minWidth: 100,
        //     render: (h, params) => {
        //         if (params.row.tag === 1) {
        //             return h(
        //                 'Poptip',
        //                 {
        //                     props: {
        //                         confirm: true,
        //                         transfer: true,
        //                         title:
        //                             params.row.tag === 0 ? '确认发布？' : '确认撤销发布？'
        //                     },
        //                     on: {
        //                         'on-ok': () => {
        //                             this.publishCompete(params.row);
        //                         }
        //                     }
        //                 },
        //                 [
        //                     h(
        //                         'Button',
        //                         {
        //                             class:
        //                                 params.row.tag === 1
        //                                     ? 'status-yes-btn'
        //                                     : 'status-no-btn',
        //                             props: {
        //                                 size: 'small',
        //                                 type: params.row.tag === 1 ? 'primary' : 'error',
        //                                 disabled: params.row.creator !== this.USER_ID
        //                                 // color:
        //                                 //     params.row.selfType === 1
        //                                 //         ? '#307CED'
        //                                 //         : 'rgba(255,255,255,0.4000)'
        //                             }
        //                             // style: {
        //                             //     margin: 0,
        //                             //     border: 'none',
        //                             //     color: '#fff',
        //                             //     background:
        //                             //         params.row.tag === 1
        //                             //             ? 'var(--status-yes)'
        //                             //             : 'var(--status-no)'
        //                             // }
        //                         },
        //                         params.row.tag === 1 ? '是' : '否'
        //                     )
        //                 ]
        //             );
        //         } else {
        //             return h(
        //                 'Button',
        //                 {
        //                     class:
        //                         params.row.tag === 1 ? 'status-yes-btn' : 'status-no-btn',
        //                     props: {
        //                         size: 'small',
        //                         type: 'error',
        //                         disabled: params.row.creator !== this.USER_ID
        //                     },
        //                     // style: {
        //                     //     margin: 0,
        //                     //     border: 'none',
        //                     //     color: '#fff',
        //                     //     background:
        //                     //         params.row.tag === 1
        //                     //             ? 'var(--status-yes)'
        //                     //             : 'var(--status-no)'
        //                     // },
        //                     on: {
        //                         click: () => {
        //                             this.showOtherModal(params.row);
        //                         }
        //                     }
        //                 },
        //                 params.row.tag === 1 ? '是' : '否'
        //             );
        //         }
        //     }
        // },

        {
          title: '竞赛模式',
          key: 'onlineMode',
          show: () => {
            return this.type == 2
          },
          filter: (onlineMode, data) => {
            return data.extension && JSON.parse(data.extension).onlineMode == 1 ? '线上' : '线下'
          },
          minWidth: 100
        },
        {
          title: '是否为分布式',
          key: 'isDistributed',
          show: () => {
            return [0, 2, 7].includes(this.type) && this.$store.state.common.showDistributed
          },
          filter: (isDistributed, data) => {
            return data.extension && JSON.parse(data.extension).isDistributed == 1 ? '是' : '否'
          },
          setColor: (isDistributed, data) => {
            return data.extension && JSON.parse(data.extension).isDistributed == 1
              ? 'var(--status-yes)'
              : 'var(--status-no)'
          },
          width: 120
        },
        {
          title: '答题模式',
          key: 'stMode',
          show: () => {
            return this.type == 4 || this.type == 7
          },
          filter: (stMode, data) => {
            return data.extension && JSON.parse(data.extension).stMode == 1
              ? '随意答题'
              : '顺序答题'
          },
          minWidth: 100
        },
        // { title: '创建时间', key: 'createTime', tooltip: true, minWidth: 100 },
        {
          title: '周期',
          key: 'cycleTime',
          show: () => {
            return this.type == 1 || this.type == 0 || this.type == 8
          },
          tooltip: true,
          filter: (cycleTime, data) => {
            return (data.type == 1 || data.type == 0 || data.type == 8) && data.extension
              ? JSON.parse(data.extension).cycleTime + '（分钟）'
              : '无'
          },
          minWidth: 100
        },
        {
          title: '周期个数',
          key: 'cycleNum',
          minWidth: 100,
          show: () => {
            return this.type == 1 || this.type == 0 || this.type == 8
          },
          filter: (cycleNum, data) => {
            return data.type == 1 || data.type == 0 || data.type == 8 ? data.cycleNum : '无'
          }
        },
        {
          title: '周期异常扣分',
          key: 'cycleScoreA',
          show: () => {
            return this.type == 8
          },
          filter: (cycleScore, data) => {
            return (data.type == 1 || data.type == 8) && data.extension
              ? JSON.parse(data.extension).cycleScore
              : '无'
          },
          minWidth: 100
        },
        {
          title: '周期分数',
          key: 'cycleScore',
          show: () => {
            return this.type == 1
          },
          filter: (cycleScore, data) => {
            return (data.type == 1 || data.type == 8) && data.extension
              ? JSON.parse(data.extension).cycleScore
              : '无'
          },
          minWidth: 100
        },
        {
          title: '基础分数',
          key: 'basicScore',
          show: () => {
            return this.type == 8
          },
          filter: (basicScore, data) => {
            return data.type == 8 && data.extension ? JSON.parse(data.extension).basicScore : '无'
          },
          minWidth: 100
        },
        {
          title: '允许重置次数',
          key: 'enResetNum',
          show: () => {
            return this.type == 8
          },
          filter: (enResetNum, data) => {
            return data.type == 8 && data.extension ? JSON.parse(data.extension).enResetNum : '无'
          },
          minWidth: 100
        },
        {
          title: '超过次数重置扣分',
          key: 'resetLostScore',
          show: () => {
            return this.type == 8
          },
          filter: (resetLostScore, data) => {
            return data.type == 8 && data.extension
              ? JSON.parse(data.extension).resetLostScore
              : '无'
          },
          minWidth: 100
        },
        {
          title: '关联资产',
          key: 'testProduct',
          show: this.type === 17,
          filter: (no, data) => {
            let testProduct =
              data.type == 17 && data.extension ? JSON.parse(data.extension).testProduct : ''
            let getData = testProduct
              ? this.productList.find((item) => item.id === testProduct)
              : ''
            return getData ? getData.name : '无'
          }
        },
        {
          title: '测试类型',
          key: 'testType',
          show: this.type === 17,
          filter: (no, data) => {
            let testType =
              data.type == 17 && data.extension ? JSON.parse(data.extension).testType : ''
            if (testType === 1) {
              return '测试开发'
            } else if (testType === 2) {
              return '产品测试'
            } else if (testType === 3) {
              return '回归测试'
            } else {
              return '比较测试'
            }
          }
        },
        {
          title: '开始时间',
          key: 'startTime',
          tooltip: true,
          minWidth: 100,
          show: () => this.type != 18
        },
        {
          title: '结束时间',
          key: 'endTime',
          tooltip: true,
          minWidth: 100
        },
        {
          type: 'html',
          title: '描述',
          key: 'description',
          minWidth: 100,
          tooltip: true,
          show: this.type != 18
        },
        { title: '创建者', key: 'creatorName', tooltip: true, minWidth: 100 },
        {
          title: '创建时间',
          key: 'createTime',
          tooltip: true,
          minWidth: 100
        },
        {
          title: '攻击行业/严重度', // 23210
          key: 'result1',
          // tooltip: true,
          show: [1].includes(this.extension), //实网测试
          width: 140,
          render: (h, params) => {
            // console.log('extension-----------------',params.row)
            let row = params.row
            return h(
              'Button',
              {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                on: {
                  click: () => {
                    this.getAttackResult(row)
                  }
                }
              },
              '查看'
            )
          }
        },
        {
          title: '漏洞统计',
          key: 'statistics',
          // tooltip: true,
          show: () => {
            return [4].includes(this.extension) && this.showAsset
          },
          minWidth: 100,
          render: (h, params) => {
            let row = params.row
            return h(
              'Button',
              {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                on: {
                  click: () => {
                    this.getVulneraStatistics(row)
                  }
                }
              },
              '查看'
            )
          }
        },
        {
          title: '漏洞结果',
          key: 'result',
          // tooltip: true,
          // show:[4].includes(this.extension),
          show: () => {
            return [4].includes(this.extension) && this.showAsset
          },
          minWidth: 100,
          render: (h, params) => {
            let row = params.row
            return h(
              'Button',
              {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                on: {
                  click: () => {
                    this.getResultInfo(row)
                  }
                }
              },
              '查看'
            )
          }
        },
        {
          title: '项目信息',
          key: 'info',
          // tooltip: true,
          // show:[4].includes(this.extension),
          show: () => {
            return [4].includes(this.extension) && this.showAsset
          },
          minWidth: 100,
          render: (h, params) => {
            let row = params.row
            return h(
              'Button',
              {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                on: {
                  click: () => {
                    this.getProjectInfo(row)
                  }
                }
              },
              '查看'
            )
          }
        },
        {
          title: '操作',
          key: 'action',
          fixed: 'right',
          width: [18].includes(this.type)
            ? 100
            : [1, 2, 8].includes(this.type)
            ? 220
            : [0, 4, 7, 10].includes(this.type)
            ? 260
            : 220,
          opList: [
            {
              txt: '快速构建',
              show: (data) => {
                return !data.projectId && [1, 2, 4, 5, 8, 9].includes(data.type)
              },
              disabled: (data) => {
                return this.setReBtnStatus(data)
              },
              on: {
                click: (row) => {
                  this.quickCreate(row)
                }
              }
            },
            {
              txt: (data) => {
                return this.available(data) ? '再次部署' : '重新构建'
              },
              show: (data) => {
                return data.projectId && [1, 2, 4, 5, 8, 9].includes(data.type)
              },
              disabled: (item) => {
                return (
                  !(
                    [0, 6, 10].includes(item.deployStatus) ||
                    this.isRemove(item) ||
                    this.partialDeploymentIsError(item)
                  ) ||
                  this.setReBtnStatus(item) ||
                  (JSON.parse(item.extension).isDistributed == 1 &&
                    JSON.parse(item.extension).isMainRange == 0)
                )
              },
              on: {
                click: (row) => {
                  this.isreconstruction(row)
                }
              }
            },
            {
              txt: '构建工程',
              show: () => this.type === 17,
              disabled: (data) => data.projectId,
              fun: (data) => {
                this.currScene = data
                this.createProModal = true
                // this.$router.push({
                //     name:'Projects',
                //     query:{
                //         safeTest:data.id
                //     }
                // })
              }
            },
            // {
            //     txt: '复制',
            //     show: () => {
            //         return this.type === 1 || this.type === 2;
            //     },
            //     disabled: (data) => {
            //         return data.creator !== this.USER_ID;
            //     },
            //     on:{
            //         click: (data,e) => {
            //             this.copyModal.show = true;
            //             this.curCopyCompete = data;
            //         }
            //     }
            // },
            {
              txt: '修改',
              // disabled: (data) => {
              //     return this.setReBtnStatus(data, 'modify');
              // },
              show: () => this.type != 18,
              on: {
                click: (data) => {
                  this.showAddAndUpdate(data)
                }
              }
            },
            {
              txt: '删除',
              type: 'delete',
              disabled: (data) => {
                return this.setReBtnStatus(data, 'delete')
              },
              on: {
                click: (data) => {
                  this.delSceneTip(data)
                }
              }
            },
            {
              txt: '存为场景模板',
              show: (data) => {
                return [0, 4, 7, 10].includes(data.type)
              },
              disabled: (item) => {
                return (
                  !(item.progress === 4 && item.deployStatus === 3) ||
                  (item.extension && JSON.parse(item.extension).isDistributed == 1)
                )
              },
              on: {
                click: (data, e) => {
                  this.openSceneTemplateModal(data.id)
                }
              }
            },
            {
              txt: '归档',
              //   title: '确定归档？',
              show: () => ![17, 18].includes(this.type),
              disabled: (data) => {
                return !(
                  !data.filingStatus &&
                  data.progress == 4 &&
                  !this.setReBtnStatus(data) &&
                  JSON.parse(data.extension).isMainRange != 0
                )
              },
              on: {
                click: (data, e) => {
                  this.openFillModal(data)
                }
              }
              //   tooltip: true
            }
            // {
            //     txt: '进入环境',
            //     disabled: (data) => {
            //         return !(data.projectId && data.deployStatus != 10);
            //     },
            //     on:{
            //         click: (data,e) => {
            //             this.gotoTopo(data)
            //         }
            //     }
            // }
          ]
        }
      ]
    }
  },
  filters: {
    deployStatusFilter(item, type) {
      let val = item.isBatchDeployment ? item.quickCreateStatus : item.deployStatus
      let str = ''
      if (type == 'text') {
        if (item.verifyError) {
          return '校验失败'
        }
        switch (val) {
          case -1:
            str = '工程不存在'
            break
          case 0:
            str = '未部署'
            break
          case 1:
            str = '部署中'
            break //同步成功
          case 2:
            str = '待部署'
            break
          case 3:
            str = '部署成功'
            break
          case 4:
            str = '删除中'
            break //导入失败
          case 5:
            str = '已编辑'
            break
          case 6:
            str = '部署失败'
            break
          case 7:
            str = '编辑错误'
            break
          case 8:
            str = '删除失败'
            break
          case 9:
            str = '部署中'
            break
          case 10:
            str = '未绑定'
            break
          case 11:
            str = '编辑失败'
            break
          case 12:
            str = '待删除'
            break
          case 13:
            str = '清空部署中'
            break
          case 14:
            str = '清空部署失败'
            break
          case 15:
            str = '部署校验中'
            break
          case 16:
            str = '导入中'
            break
          case 17:
            str = '导入失败'
            break
          case 'init':
            str = '部署已清空'
            break
          case 'deploying':
            str = '批次部署中'
            break
          case 'complete':
            str = '批次部署完成'
            break
          case 'error':
            str = '批次部署错误'
            break
          case 'queryError':
            str = '部署查询错误'
            break
          default:
            break
        }
      } else {
        if (item.verifyError) {
          return 'var(--status-no)'
        }
        switch (val) {
          case 0:
          case 2:
          case 5:
          case 10:
          case -1:
          case 'init':
            str = 'var(--status-pre)'
            break //default
          case 1:
          case 9:
          case 15:
          case 16:
          case 'deploying':
            str = 'var(--status-ing)'
            break //green
          case 3:
          case 'complete':
            str = 'var(--status-yes)'
            break
          case 6:
          case 7:
          case 8:
          case 11:
          case 14:
          case 17:
          case 'error':
          case 'queryError':
            str = 'var(--status-no)'
            break //red
          case 4:
          case 13:
            str = 'var(--status-deling)'
            break
          //case 10:str = 'blue';break;
          default:
            str = 'var(--status-pre)'
            break
        }
      }
      return str
    },
    // 转义演练、竞赛场景进度的状态码为对应的中文和按钮样式
    progressFilter(val, type) {
      let str = ''
      if (type == 'text') {
        switch (val) {
          case 0:
            str = '准备中'
            break
          case 1:
            str = '准备完毕'
            break
          case 2:
            str = '进行中'
            break
          case 3:
            str = '裁判评判阶段'
            break
          case 4:
            str = '已结束'
            break
          case 5:
            str = '已暂停'
            break
          case 6:
            str = '删除中'
            break
          case 7:
            str = '删除失败'
            break
          default:
            break
        }
      } else {
        switch (val) {
          case 0:
            str = 'var(--status-pre)'
            break
          case 1:
            str = 'var(--status-pre)'
            break
          case 2:
            str = 'var(--status-ing)'
            break
          case 3:
            str = 'var(--status-ing)'
            break
          case 4:
            str = 'var(--status-deling)'
            break
          case 5:
            str = 'var(--status-suspend)'
            break
          case 6:
            str = 'var(--status-deling)'
            break
          case 7:
            str = 'var(--status-no)'
            break
          default:
            str = 'var(--status-pre)'
            break
        }
      }
      return str
    }
  },
  computed: {
    ...mapGetters(['showAsset']),
    ...mapState('compet', ['hasFile']) // 菜单组建中已经获取了是否需要归档的配置，不需要归档时，不展示归档按钮
  },
  methods: {
    // 判断竞赛、演练绑定的工程是否还存在
    available(item) {
      return item.projectId && item.available
    },
    // 分批部署是否部署失败
    partialDeploymentIsError(item) {
      return ['error', 'init'].includes(item.quickCreateStatus)
    },
    // 计算出结束时间24小时后的销毁时间
    destoryTime(item) {
      return new Date(item.endTime).getTime() + 24 * 60 * 60 * 1000
    },
    // 判断比赛、演练是否处于删除失败、删除中的状态
    isRemove(item) {
      return [6, 7].includes(item.progress)
    },
    // 调用父组件方法，进入详情页
    toDetailPageTip(item) {
      let extension
      try {
        extension = JSON.parse(item.extension)
      } catch (e) {
        extension = {}
      }
      const deploymentType = extension.deploymentType
      if (![2, 4].includes(item.progress)) {
        // 非结束、进行中的状态，需要看工程状态判断能不能进入场景详情页
        if (
          item.deployStatus != 3 || // 部署成功允许进入，部署清空后处于未部署状态，也允许进入
          (deploymentType && ['error', 'deploying', 'queryError'].includes(item.quickCreateStatus))
        ) {
          //
          this.$Message.warning('未部署成功不可进入！')
          return
        }
      }
      if (item.progress == 2) {
        if (
          [0, 1, 2, 9].includes(item.deployStatus) ||
          (deploymentType && item.quickCreateStatus === 'deploying')
        ) {
          this.$Message.warning('工程部署中不可进入！')
          return
        }
      }
      if (!item.startTime || !item.endTime) {
        if (this.setReBtnStatus(item, 'modify')) {
          this.$Message.warning('未设置竞赛起止时间不可进入！')
        }
        return
      }
      if (item.projectId) {
        this.toDetailPage(item)
      } else {
        this.$Message.warning('工程不存在！')
      }
    },
    // 跳转至拓扑页面
    gotoTopo(scene) {
      if (scene.projectId && scene.deployStatus != 10) {
        // 10：未绑定工程
        window.open(
          `/14-topologyProject/index.html#/topologyDisplay/topologys?projectId=${scene.projectId}`
        )
      } else {
        this.$Message.warning('工程不存在！')
      }
    }
  }
}
